<template>
  <div
    v-loading="loading"
    class="rc-cont"
    xs-empty-icon="nopermission"
    xs-empty-text="暂无权限">
    <el-tabs
      v-model="tabCurrentName"
      nav-mode="more"
    >
      <el-tab-pane
        label="关系图谱"
        name="relation">
        <relation-map
          :id="id"
          :key="`relation${refreshKey}`" />
      </el-tab-pane>
      <el-tab-pane
        label="客户图谱"
        name="enterprise">
        <enterprise-map
          :id="id"
          :detail="detail" />
      </el-tab-pane>
    </el-tabs>

  </div>
</template>

<script type="text/javascript">
import RelationMap from './RelationMap'
import EnterpriseMap from './EnterpriseMap'

export default {
  name: 'RelativeCustomerMap', // 图谱
  components: {
    RelationMap,
    EnterpriseMap
  },
  mixins: [],
  inject: ['rootTabs'],
  props: {
    // 模块ID
    id: [String, Number],
    // 首要联系人ID
    contactsId: [String, Number],
    // 客户类型
    crmType: {
      type: String,
      default: ''
    },
    // 是公海 默认是客户
    isSeas: {
      type: Boolean,
      default: false
    },
    // 联系人人下 新建商机 需要联系人里的客户信息  合同下需要客户和商机信息
    detail: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {
      loading: false,
      tabCurrentName: 'relation',
      refreshKey: Date.now()
    }
  },
  watch: {
    id(val) {
      this.getDetail()
    },

    'rootTabs.currentName'(val) {
      if (val === 'RelativeCustomerMap') {
        this.getDetail(false)
      }
    }
  },
  mounted() {},
  methods: {
    /**
     * 获取数据
     */
    getDetail() {
      this.refreshKey = Date.now()
    }
  }
}
</script>
<style lang="scss" scoped>
@import "../../styles/relativecrm.scss";

::v-deep .el-tabs__nav-wrap::after {
  display: none !important;
}
</style>
